/*
*===============DdmgCloudPlatform3 V2.0===============
* DdmgCloudPlatform3 V2.0
* Copyright@大大买钢2018,All Rights Reserved
* Author: yiChangBin(2055960489@qq.com)
* Date: 2019/6/6  9:16
* TODO: 销售-->销售合同查看
*===============DdmgCloudPlatform3 V2.0===============
*/
<template>
    <d2-container class="trade-order-page-look" v-if="orderDetail">
        <template slot="header">
            <div class="flex header">
                <span class="title">销售合同查看</span>
                <span class="flex-1"/>
                <span class="cherck_name">操作员：{{orderDetail.updater}}</span>
                <span class="order_no">合同单号：{{orderDetail.order_no}}</span>
            </div>
            <el-form :model="orderDetail" class="order-content">
                <el-row :gutter="10">
                    <el-col :span="6">
                        <el-form-item label="登记机构：" label-width="100px">
                            <span>{{orderDetail.institutional_name}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="部门：" label-width="100px">
                            <span>{{orderDetail.dep_name}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="业务员：" label-width="100px">
                            <span>{{orderDetail.clerk_name}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="签订日期：" label-width="100px">
                            <span>{{orderDetail.order_date | dateformat}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="合同编号：" label-width="100px">
                            <span>{{orderDetail.agreement_no}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="有效期：" label-width="100px">
                            <span>{{orderDetail.active_time | dateformat}}至{{orderDetail.end_time | dateformat}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="购货单位：" label-width="100px">
                            <span>{{orderDetail.buy_unit_id_name}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="项目：" label-width="100px">
                            <span>{{orderDetail.project_name}}</span>
                        </el-form-item>
                    </el-col>

                    <el-col :span="6">
                        <el-form-item label="供货重量：" label-width="100px">
                            <span>{{orderDetail.weight | formatNumber4}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="合同金额：" label-width="100px">
                            <span>{{orderDetail.amount | formatNumber2}}</span>
                        </el-form-item>
                    </el-col>

                    <el-col :span="12" v-if="orderDetail.remark">
                        <el-form-item label="备注：" label-width="100px">
                            <span>{{orderDetail.remark}}</span>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </template>
        <div class="flex detail">
            <span class="title">物资明细</span>
        </div>
        <detail-table
                :tableList="orderDetail.items"
        />
        <div class="flex detail" style="margin-top: 10px" ><span class="title">合同条款</span></div>
        <div class="components-container">
            <div>
                <tinymce v-model="orderDetail.comment" :height="300" :isLook="true"/>
            </div>
        </div>
        <template slot="footer">
            <div class="flex fonter-container">
                <span class="flex-1"/>
                <el-button size="mini" @click="close">关闭</el-button>
                <el-button
                        type="primary"
                        size="mini"
                        @click="onAddNew"
                        v-if="type==3 && hasButtonPermission(['增加'])"
                >新单</el-button>
                <el-button
                        type="primary"
                        size="mini"
                        @click="onEditSelf"
                        v-if="type==3 && hasButtonPermission(['编辑'])"
                >编辑</el-button>
            </div>
        </template>
    </d2-container>
</template>

<script>
  import { createNamespacedHelpers } from "vuex";
  import DetailTable from "./DetailTable";
  import Set2DbMixin from "@/mixin/Set2DbMixin";
  import { intersection } from "lodash";

  import Tinymce from '@/components/Tinymce'
  const { mapState } = createNamespacedHelpers("ddmg/salesContractOperation");
  export default {
    name: "salesContractLook",
    mixins: [Set2DbMixin],
    components: {
      DetailTable,
      Tinymce,
    },
    props: {
      type: {
        type: Number | String,
        default() {
          return "";
        },
      },
    },

    methods: {

      //添加成功后重新添加一个新单
      onAddNew() {
        this.$parent.getInitInfo({
          type: 1,
          order_no: "",
        });
      },

      //编辑当前保存的新单
      onEditSelf() {
        this.$parent.getInitInfo({
          type: 2,
          order_no: this.orderDetail.order_no,
        });
      },

      close() {
        this.$store.dispatch("d2admin/page/close", {
          tagName: "/sale/salesContractOperation",
          vm: this,
        });
      },
      hasButtonPermission(name) {
        /*return intersection(this.buttons, name).length != 0;*/
        return true;
      },
    },

    computed: {
      ...mapState({
        orderDetail: (state) => state.lookDetail,
       /* buttons: (state) => (state.purchaseInDetail.buttons.length !== 0 ? state.purchaseInDetail.buttons.map((v) => v.name.trim()) : ["-1"]), //按钮权限*/
      }),
    },
  };
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    @import "../../../../assets/style/tradeOrderPageLook";
</style>